<!--
1. Vue所有的指令，在调用的时候，都以 v- 开头
2. 使用Vue.directive(x,y) 定义全局的指令,其中
    1. 参数1是指令的名称 注意，在定义的时候不需要加 v- 前缀，但是在调用的时候，必须要在指令名称前加上v-前缀
    2. 参数2是一个对象，这个对象上，有一些指令相关的函数，这些函数在特定的阶段，执行相关的操作
        2.1 bind 每当指令绑定到元素上的时候，会立即执行这个bind函数，只执行一次
            在元素刚绑定了指令的时候，还没有插入到dom中去，这时候调用focus没有作用，因为一个元素只有插入dom之后才能获取焦点。
        2.2 inserted 表示元素插入到DOM中的时候，会执行inserted函数
        2.3 updated 当VNode更新的时候，会执行
        2.4 在每个函数中， 第一个参数永远是el，表示被绑定了指令的那个元素，这个el参数是一个原生的js对象
3. 使用VUE指令的时候，外层div必须要和Vue对象相关联起来
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../lib/vue.js"></script>
</head>
<body>
    <div id="app">
        <input type="text" v-focus>
    </div>
    <script>
        Vue.directive('focus',{
            inserted: function (el) {
                el.focus();
            },
        });
        
        var vm=new Vue({
            el:"#app"
        });
    </script>
</body>
</html>